<template>
  <view class="tp-footer">
    <ai-divider size="sm">易路由你</ai-divider>
    <view class="tp-footer-content">
      <view class="qk-link-box">
        <view @click="nav2Webview('https://www.daotian.info/cdn/service_protocol.html')">服务协议</view>
        <view class="spliter"></view> 
        <navigator url="/pages/my/qa">常见问题</navigator>
      </view>
      <text class="brand-copy">© 2024 杭州稻田网络科技有限公司</text>
      <text class="brand-copy">浙ICP备17021382号-3</text>
    </view>

  </view>
</template>

<script>
  export default {
    name: "tp-footer",
    data() {
      return {

      };
    }
  }
</script>

<style lang="scss">
  @import "@/styles/_var.scss";

  .tp-footer {
    margin: 30px 15px;
    font-size: $font-size-sm;
    color: var(--gray-3);
    
    .tp-footer-content {
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    .qk-link-box {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: center;
      height: 40rpx;
      line-height: 40rpx;

      .spliter {
        &:after {
          content: " ";
          border-right: 2rpx solid $gray-3;
        }

        font-size: 16rpx;
        padding-right: 2rpx;
        display: inline-block;
        margin: 0 16rpx;
      }
    }

    .brand-copy {
      text-align: center;
      padding: 4rpx 0;
    }
  }
</style>